<!--三键下单-->
<template>

	<mt-popup
			v-model="popupVisible"
			popup-transition="popup-fade"
			position="left" style="width:100%;height:100%;z-index:11;">
	   	<!-- <mt-header fixed title="购买">
			<mt-button icon="back" @click="close" slot="left">关闭</mt-button>
			<mt-button   slot="right">  </mt-button>
		</mt-header> -->
         <div style="width:750px;height:40px;"></div>
		<div>
			<div>
				<!-- <mt-field class="contract" label="合约代码" v-model="namesp" disabled="disabled" placeholder="请输入合约代码"></mt-field>

				<mt-field class="contract" label="价格" v-model="price" type="number" placeholder="请输入价格" ></mt-field>
		
		    	<mt-field class="contract" label="手数" v-model="Numberhand" type="number" placeholder="请输入手数"></mt-field>
			
					 <mt-radio class="contract"
				title="类型"
				v-model="valueradio"
				:options="['投机', '套利', '套保']">
				</mt-radio>

			    <mt-button @click="twobuy" class="butt_div1" type="danger">买入</mt-button>
	           <mt-button @click="twopsell" class="butt_div2" type="primary">卖出</mt-button>
 -->


				<!---->
				<!--<div class="tabdiv">-->
				<!--</div>-->
				<!--<div class="transaction_in">-->
				<!--<div class="transaction_in_right">-->
				<!--<div>-->
				<!--<div class="divTab" v-show="nowIndex===0">-->
				<!--<div class="Twokey" style="margin-top: 2rem;">-->
				<!--<span class="twokey_title">合&nbsp;约</span>-->
				<!--<input v-model="namesp" readonly style="padding-left:10px;width:120px;height:25px;border-radius: 3px;background-color:#FAEEEE;"-->
				<!--@click="change(this)">-->
				<!--<div class="twokey_right"></div>-->
				<!--<select v-model="typename" id="select" style="width:50px;height:22px;border-radius: 3px;" @click="change(this)">-->
				<!--<option :value="coupon.name" v-for="coupon in typeList">{{coupon.name}}</option>-->
				<!--</select>-->
				<!--</div>-->
				<!--<div class="Twokey_divin">-->
				<!--<div class="Twokey_in">-->
				<!--<div class="Twokey">-->
				<!--<span class="twokey_title">手&nbsp;&nbsp;数</span>-->
				<!--<input class="twokey_hands" v-model="Numberhand" type="number" name="number" value="1" min="1">-->
				<!--</div>-->
				<!--<div class="Twokey">-->
				<!--<span class="twokey_title">价&nbsp;&nbsp;格</span>-->
				<!--<input class="twokey_hands" v-model="price" type="number" name="number" value="1" min="1">-->
				<!--</div>-->
				<!--</div>-->
				<!--<div class="Twokey_isn_right">-->
				<!--<div class="reset" @click="recovery">-->
				<!--<span>复&nbsp;位</span>-->
				<!--</div>-->
				<!--<div class="reset" @click="condcli">-->
				<!--<span>条件单</span>-->
				<!--</div>-->
				<!--</div>-->
				<!--</div>-->
				<!--<div class="indiv">-->
				<!--<span>买可平≤0&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>-->
				<!--<span>买可平≤0&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>-->
				<!--<span>买可平≤0</span>-->
				<!--</div>-->
				<!--<div class="Business">-->
				<!--<div class="Business_left" @click="twobuy()">-->
				<!--<span class="Business_left_font">{{buydis}}</span>-->
				<!--<div class="Business_left_bor1"></div>-->
				<!--<span class="Business_left_font">买&nbsp;入</span>-->
				<!--</div>-->
				<!--<div class="Business_right" @click="twopsell()">-->
				<!--<span class="Business_left_font">{{selldis}}</span>-->
				<!--<div class="Business_left_bor2"></div>-->
				<!--<span class="Business_left_font">卖&nbsp;出</span>-->
				<!--</div>-->
				<!--<div class="Business_right2">-->
				<!--<span class="Business_left_font">&#45;&#45;</span>-->
				<!--<div class="Business_left_bor3"></div>-->
				<!--<span class="Business_left_font">无&nbsp;仓</span>-->
				<!--</div>-->
				<!--</div>-->
				<!--</div>-->
				<!--</div>-->
				<!--</div>-->
				<!--</div>-->
				<!--</div>-->
				<!--条件单-->
				<!-- <div class="stoppo" v-show="disscond">
                    <Conditionsheet v-on:headstop="stopdis"></Conditionsheet>
                 </div> -->
			</div>
		</div>



	</mt-popup>


</template>

<script>
import { mapState, mapGetters } from "vuex";
import { Popup } from "mint-ui";
import Conditionsheet from "./Conditionsheet";

export default {
  name: "",
  data() {
    return {
      popupVisible: false,
      oneitem: {},
      tabsParam: ["两键下单", "三键下单", "普通下单"],
      // imags:'../assets/Navigation/1.png',
      nowIndex: 0,
      namesp: "", //合约
      Numberhand: "", //手数
      price: "", //价格
      typename: "", //投机类型
      selldis: "0", //卖价显示
      buydis: "0", //买家显示
	  disscond: false, //条件单
	  valueradio:''
    };
  },
  components: {
    Conditionsheet
  },
  created: function() {
    var that = this;
    // that.typename = this.typeList[0].name;
  },
  mounted() {},
  computed: {
    ...mapGetters(["getOneSaleProduct"])
  },
  components: {
    Popup
  },
  watch: {
    getOneSaleProduct(val) {
      if (!val) {
        return;
      }
      let item = this.$store.state.one_show_product;
      var that = this;
      (that.popupVisible = true), (that.namesp = val.name); //名称
      that.selldis = val.sell_one; //卖价显示
      that.buydis = val.buy_one; //买价显示
      that.id = val.id; //id
      that.done_price = val.done_price; //最新价
      that.price = that.done_price;
    }
  },
  methods: {
    close() {
      this.popupVisible = false;
      this.$store.commit("setOneSaleProduct", {});
    },
    toggleTabs: function(index) {
      this.nowIndex = index;
    },
    change(obj) {
      // var value = $(obj).find('option:selected').text();
      // $('#datashow').val(value);
    },
    stopdis(msg) {
      //条件单
      this.aaa = msg;
      if ((this.aaa = "val")) {
        this.disscond = false;
      }
    },
    condcli() {
      var that = this;
      if (typeof that.id == "undefined" || !that.id) {
        return that.$message.error("请先选择商品！");
      }
      // that.disscond = true;
      this.$emit("headCallBack", "cond");
    },
    twopsell() {
     //卖出
		   var that = this;
          if (that.valueradio == "投机") {
        that.typenames = "1";
      } else if (that.valueradio == "套利") {
        that.typenames = "2";
      } else if (that.valueradio == "套保") {
        that.typenames = "3";
	  }
      if (that.id == "") {
        return that.$message.error("请选择商品！");
      }
      if (that.Numberhand == "") {
        return that.$message.error("请填写手数！");
      }
      if (that.price == "") {
        return that.$message.error("请输入价格！");
	  }
	   if (that.valueradio == "") {
        return that.$message.error("请选择类型！");
      }
      that
        .$http({
          method: "POST",
          headers: {
            "Content-Type": "application/json; charset=UTF-8"
          },
          url:
            that.$serverUrl +
            "futures_orders?product_id=" +
                 that.id +
			"&order_type=2&ware=1&direction=1"+
            "&hand=" +
            that.Numberhand +
            "&price=" +
            that.price +
            "&toubao=" +
            that.typenames
        })
        .then(
          res => {
            if (res.data.msg == "success") {
			  that.$message.success("卖出成功！");
            } else {
              that.$message.error(res.data.msg);
            }
          },
          function(error) {}
        );
    },
    twobuy() {
		//买入
		   var that = this;
          if (that.valueradio == "投机") {
        that.typenames = "1";
      } else if (that.valueradio == "套利") {
        that.typenames = "2";
      } else if (that.valueradio == "套保") {
        that.typenames = "3";
	  }
      if (that.id == "") {
        return that.$message.error("请选择商品！");
      }
      if (that.Numberhand == "") {
        return that.$message.error("请填写手数！");
      }
      if (that.price == "") {
        return that.$message.error("请输入价格！");
	  }
	   if (that.valueradio == "") {
        return that.$message.error("请选择类型！");
      }
      that
        .$http({
          method: "POST",
          headers: {
            "Content-Type": "application/json; charset=UTF-8"
          },
          url:
            that.$serverUrl +
            "futures_orders?product_id=" +
                 that.id +
			"&order_type=2&ware=1&direction=2"+
            "&hand=" +
            that.Numberhand +
            "&price=" +
            that.price +
            "&toubao=" +
            that.typenames
        })
        .then(
          res => {
            if (res.data.msg == "success") {
			  that.$message.success("买入成功！");
            } else {
              that.$message.error(res.data.msg);
            }
          },
          function(error) {}
        );
    },
    //复位
    recovery() {
      var that = this;
      that.Numberhand = "";
      that.price = that.done_price;
      // console.log("合约=" + that.namesp)
      // console.log("开仓类型=" + that.radioVal)
      // console.log("手数=" + that.Numberhand)
      // console.log("价格=" + that.price)
      // console.log("投机=" + that.typenames)
      // console.log("id=" + that.id)
    }
  }
};
</script>

<style scoped>
.contract {
  width: 550px;
  margin-left: 20px;
}
.butt_div1{
	width: 600px;
	margin-top: 20px;
	margin-bottom: 30px;
	margin-left: 75px;
}
.butt_div2{
	width: 600px;
	margin-left: 75px;
}
</style>